<template>
  <div class="home">
    <div>Vuex-action基本操作</div>
    <div>{{$store.state.length}}</div>
    <button @click='queryData(123)'>查询</button>
  </div>
</template>

<script>
import { mapActions } from 'vuex'
// 借助mapActions函数简化action的触发：直接把action映射为函数
export default {
  data () {
    return {
      count: 10
    }
  },
  methods: {
    // handleClick () {
    //   // 调用接口获取数据：触发action
    //   this.$store.dispatch('queryData', 123)
    // }
    // 参数是对象
    // ...mapActions({
    //   handleClick: 'queryData'
    // })
    // 参数是数组
    ...mapActions(['queryData'])
  }
}
</script>
